<%--
  Created by IntelliJ IDEA.
  User: 柚木
  Date: 2022/12/23
  Time: 12:32
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/includePage.css">
    <link rel="stylesheet" href="css/allBookPage.css">
    <script src="https://kit.fontawesome.com/e91f25b25e.js" crossorigin="anonymous"></script>
    <title>图书管理系统-图书租借</title>
</head>

<%@ include file="IncludePage.jsp"  %>

    <div class="search">
        <a href="bookHome" class="link search-title">BookManage</a>
        <input type="text" class="search-input" id="search-input" placeholder="请输入书名">
        <button class="btn search-btn" id="search-btn">搜索</button>
    </div>

    <div class="btn reset-btn" id="reset-btn">重置</div>

    <div class="search-auto-complete" id="auto-complete">
        <ul class="auto-complete-list" id="auto-complete-list">
                        <li data-bookName = "《三体》">《三体》</li>
                        <li>《三体2》</li>
                        <li>《三体3》</li>
                        <li>《三体4》</li>
                        <li>《三体5》</li>
        </ul>
    </div>

    <div class="book-table">
    <table class="table" id="book-table">
        <tr class="table-title">
            <th class="col1">编号</th>
            <th class="col2">名称</th>
            <th class="col3">作者</th>
            <th class="col4">类别</th>
            <th class="col5">出版社</th>
            <th class="col6">描述</th>
            <th class="col7">库存</th>
            <th class="col8">操作</th>
        </tr>
<%--        <tr id="table-item">--%>
<%--            <td>01</td>--%>
<%--            <td>《三体》</td>--%>
<%--            <td>刘慈欣</td>--%>
<%--            <td>科幻、小说</td>--%>
<%--            <td>重庆出版社</td>--%>
<%--            <td>这是一本我们期盼已久的科幻小说，它是对中国科幻的巨大贡献。</td>--%>
<%--            <td>28</td>--%>
<%--            <td class="btns-action">--%>
<%--                <button class="action-btn">详情</button>--%>
<%--                <button class="action-btn">借阅</button>--%>
<%--            </td>--%>
<%--        </tr>--%>
    </table>

    <div class="nav-bottom">
        <p class="total">共1条</p>
        <a href="#" class="link">上一页</a>
        <p class="current-page">第1页</p>
        <a href="#" class="link">下一页</a>
        <p>跳转到第</p>
        <input type="text" class="target-page">
        <p>页</p>
    </div>
</div>

</div>
<script src="js/includePage.js"></script>
<script src="js/allBook.js"></script>
</body>
</html>
